// X轴方向
.f-row{
	display: flex;
	flex-direction: row;
}
.f-row-center{
	display : flex;
	flex-direction: row;
	justify-content: center;
}
.f-row-between{
	display : flex;
	flex-direction: row;
	justify-content: space-between;
}
.f-row-around{
	display : flex;
	flex-direction: row;
	justify-content: space-around;
}
.f-row-end{
	display : flex;
	flex-direction: row;
	justify-content: flex-end;
}
// Y轴方向
.f-col{
	display : flex;
	flex-direction: column;
}
.f-col-center{
	display : flex;
	flex-direction: column;
	justify-content: center;
}
.f-col-between{
	display : flex;
	flex-direction: column;
	justify-content: space-between;
}
.f-col-around{
	display : flex;
	flex-direction: column;
	justify-content: space-around;
}
.f-col-end{
	display : flex;
	flex-direction: column;
	justify-content: flex-end;
}
.align-item-center{
	align-items:center;
}
.align-item-end{
	align-items:flex-end;
}
.align-item-around{
	align-items:space-around;
}
.align-item-between{
	align-items:space-between;
}
//多行交叉轴
.align-content-center{
	align-content:center;
}
.align-content-end{
	align-content:flex-end;
}
.align-content-around{
	align-content:space-around;
}
.align-content-between{
	align-content:space-between;
}

//子级份数
.flex-1{flex:1;}
.flex-2{flex:2;}
.flex-3{flex:3;}
.flex-4{flex:4;}
.flex-5{flex:5;}
.flex-6{flex:6;}

//圆角属性
.b-r-4{border-radius: 4px;}
.b-r-6{border-radius: 6px;}
.b-r-8{border-radius: 8px;}
.b-r-12{border-radius: 12px;}

//外边距
.m-8{margin: 8px;}

.m-l-2{margin-left: 2px;}
.m-l-4{margin-left: 4px;}
.m-l-8{margin-left: 8px;}
.m-l-12{margin-left: 12px;}

.m-r-2{margin-right: 2px;}
.m-r-4{margin-right: 4px;}
.m-r-8{margin-right: 8px;}
.m-r-12{margin-right: 12px;}

.m-t-2{margin-top: 2px;}
.m-t-4{margin-top: 4px;}
.m-t-8{margin-top: 8px;}
.m-t-12{margin-top: 12px;}
.m-t-16{margin-top: 16px;}
.m-t-20{margin-top: 20px;}

.m-b-2{margin-bottom: 2px;}
.m-b-4{margin-bottom: 4px;}
.m-b-8{margin-bottom: 8px;}
.m-b-12{margin-bottom: 12px;}
.m-b-16{margin-bottom: 16px;}
.m-b-20{margin-bottom: 20px;}

.m-l-r-2{margin-left: 2px; margin-right: 2px;}
.m-l-r-4{margin-left: 4px; margin-right: 4px;}
.m-l-r-8{margin-left: 8px; margin-right: 8px;}
.m-l-r-12{margin-left: 12px; margin-right: 12px;}

//内边距
.p-4{padding: 4px;}
.p-8{padding: 8px;}
.p-12{padding: 12px;}

.p-l-r-4{padding-left: 4px; padding-right: 4px;}
.p-l-r-8{padding-left: 8px; padding-right: 8px;}
.p-l-r-12{padding-left: 12px; padding-right: 12px;}
.p-l-r-16{padding-left: 16px; padding-right: 16px;}
